<script setup>
import { introApi } from "@/services/index";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import { nextTick, ref, watch, onMounted, onUnmounted } from "vue";

import topNav from "../../components/topNav.vue";
import code from "@/static/cashier/code.png";
import sand from "@/static/cashier/sand.png";
import num from "@/static/cashier/num.png";

import { appPayResult } from "@/services/cashier";
const id = ref("");
const payStatus = ref("true");
const oriOrgTrace = ref("");
const outTrace = ref("");
const TimeGo = ref(null);
const TimeIndex = ref(5);
const payNum = ref(0);
const message = ref("");
const payPrice = ref(0);
const uPid = ref("");
onLoad((e) => {
  uPid.value = e.uPid ? e.uPid : "";
  id.value = e.orderid ? e.orderid : "";
  payNum.value = e.payNum ? e.payNum : "";
  payPrice.value = e.payPrice ? e.payPrice : "";
});

onShow(() => {
  TimeIndex.value = 5;
  // getPayResult();
});
onUnmounted(() => {
  if (TimeGo.value) {
    clearInterval(TimeGo.value);
  }
});
onHide(() => {
  if (TimeGo.value) {
    clearInterval(TimeGo.value);
  }
});

const getPayResult = async () => {
  let res = await appPayResult({ id: id.value });
  payStatus.value = res.data.result;
  // payStatus.value = "wait";
  if (res.data.result == "wait") {
    setTimeout(() => {
      getPayResult();
    }, 1500);
  }

  if (res.data.result == "false") {
    message.value = res.data.message;
  }
  if (res.data.result == "true") {
    oriOrgTrace.value = res.data.oriOrgTrace;
    outTrace.value = res.data.saleorderCode;
    payPrice.value = res.data.actuallyAmt;
    TimeGo.value = setInterval(() => {
      if (TimeIndex.value <= 0) {
        clearInterval(TimeGo.value);
        // console.log("支付成功");
        goPay();

        return;
      }
      TimeIndex.value = TimeIndex.value - 1;
    }, 1000);
  }
  console.log(res);
};
const goPay = () => {
  uni.reLaunch({
    url: "/pages/index/index",
  });
};
const goRecord = () => {
  uni.redirectTo({
    url: "/pages/require_goods/list/index",
  });
};
const goRPay = () => {
  uni.redirectTo({
    url:
      "/pages/cashier/goods_confirm/index?id=" +
      outTrace.value +
      "&payNum=" +
      payNum.value,
  });
};
</script>

<template>
  <view class="bg">
    <up-navbar
      bgColor="#ffffff"
      @rightClick="rightClick"
      :autoBack="true"
      :safeAreaInsetTop="true"
      :fixed="true"
      :placeholder="true"
      :leftText="'返回'"
    >
      <template #right> </template>
      <template #center>
        <text
          class="text-white"
          style="
            font-weight: 500;
            font-size: 34rpx;
            color: #000000;
            line-height: 48rpx;
            text-align: center;
          "
          >提交结果</text
        ></template
      >
    </up-navbar>

    <view class="payState" v-if="payStatus == 'false'">
      <view class="payState-top">
        <image src="@/static/cashier/icon_h.png" mode="scaleToFill" />
      </view>
      <view class="payState-title">支付失败</view>
      <view class="payState-des">{{ message }}</view>
      <view class="pay-to">
        <up-button
          @click="goRPay"
          class="pay-to-bt"
          type="primary"
          text="更换收款方式"
        ></up-button>
      </view>
    </view>
    <view v-if="payStatus == 'true'">
      <view class="payState">
        <view class="payState-top">
          <image src="@/static/cashier/icon_l.png" mode="scaleToFill" />
        </view>
        <view class="payState-title">{{ uPid ? "修改成功" : "提交成功" }}</view>
        <view class="payState-des">等待总部统一采购</view>
        <view class="btn-to">
          <view class="select-pay">
            <up-button
              @click="goPay"
              class="select-pay-bt"
              type="primary"
              text="回首页"
            ></up-button>
          </view>
          <!-- <view class="payState-des payState-des-num">¥{{ payPrice }}</view> -->
          <view class="pay-to">
            <up-button
              @click="goRecord"
              class="pay-to-bt"
              type="primary"
              text="查看要货申请单"
            ></up-button>
          </view>
        </view>
      </view>
      <!-- <view class="pay-info">
        <view class="pay-info-item">
          <text>订单编号</text>
          <text>{{ oriOrgTrace }}</text>
        </view>
        <view class="pay-info-item">
          <text>支付单号</text>
          <text>{{ outTrace }}</text>
        </view>
      
        <view class="select-pay">
          <up-button
            @click="goPay"
            class="select-pay-bt"
            type="primary"
            text="继续收银"
          ></up-button>
        </view>
        <view class="payState-time">{{ TimeIndex }}s后自动跳转...</view>
      </view> -->
    </view>

    <view class="payState" v-if="payStatus == 'unknown'">
      <view class="payState-top">
        <image src="@/static/cashier/icon_c.png" mode="scaleToFill" />
      </view>
      <view class="payState-title">无法操作</view>
      <view class="payState-des">无法联网，请检查您的网络</view>
      <view class="pay-to">
        <up-button
          class="pay-to-bt"
          type="primary"
          text="更换收款方式"
        ></up-button>
      </view>
    </view>

    <view class="payState" v-if="payStatus == 'wait'">
      <view class="payState-top">
        <image src="@/static/cashier/icon_lv.png" mode="scaleToFill" />
      </view>
      <view class="payState-title">等待处理</view>
      <view class="payState-des">收款中，请等待...</view>
      <!-- <view class="pay-to">
        <up-button
          class="pay-to-bt"
          type="primary"
          text="更换收款方式"
        ></up-button>
      </view> -->
    </view>
  </view>
</template>

<style lang="scss" scoped>
@import "index.scss";
</style>
